import {useState,useEffect} from 'react'
export function useWinSize(){
  // 定义size和设置size的方法
  // 默认值是当前窗口的宽高
  var [size,setSize] = useState({w:window.innerWidth,h:window.innerHeight})
  const onResize = ()=>{
    // 当窗口发生变化时候更新size
    setSize({w:window.innerWidth,h:window.innerHeight})
  }
  useEffect(()=>{
    // 组件挂载完毕监听window的resize事件,执行onResize方法
    window.addEventListener("resize",onResize);
    // 组件卸载移除监听
    return ()=>window.removeEventListener("resize",onResize)
  },[])
  return size;
}
 


// ------------------------------
// export function useWinSize(){}
// export {useWinSize}
// import {useWinSize} from 'xxxx'
// 如果export  非default  导入名称必须和原方法名一致
// import {useWinSize as uws} from 'xxx'



// export default function useWinSize(){}
// export defualt useWinSize
// import useWinSize from 'xxxx'
// 如果export default 导入名称不用和原来方法一致